<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>index</title>
    <link rel="stylesheet" href="css/global.css">
    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="css/index.css">
    <link rel="shortcut icon" href="images/logo.jpg">
    <!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
    <!--[if lt IE 9]>
        <script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
    <!-- Le fav and touch icons -->
</head>

<body>
    <div id="box">
        <div class="header">
            <div class="col-md-1">
                <a href="index.html"><img class="logo" src="images/logo.jpg" alt="logo"></a>
            </div>
            <div class="login col-md-1 col-md-offset-9" v-if="nolog==0">
                <button type="button" class="login btn btn-success" @click="login">登录</button>
            </div>
            <div class="login col-md-3 col-md-offset-8" v-if="nolog==1">
                <div class="user-info">
                    <a href="views/userInfo.html"><img class="head-img" src="images/logo.jpg" alt="用户头像"></a>
                    <a class="user-name" href="views/userInfo.html" title="">用户名</a>
                    <a class="logout" href="javascript:void(0)" @click="logout">注销</a>
                </div>
            </div>
        </div>
        <div id="nav" class="clearfix">
            <ul class="nav nav-pills" role="navigation">
                <li class="active"><a href="#">nav1</a></li>
                <li><a href="#">nav2</a></li>
                <li><a href="#">nav3</a></li>
                <li><a href="#">nav4</a></li>
                <li><a href="#">nav2</a></li>
                <li><a href="#">nav3</a></li>
                <li class="dropdown">
                    <a class="dropdown-toggle" data-toggle="dropdown" href="#">nav4<span class="caret"></span></a>
                    <ul class="dropdown-menu" role="menu">
                        <li><a href="script:viod(0)">nav4子选项1</a></li>
                        <li><a href="script:viod(0)">nav4子选项2</a></li>
                        <li><a href="script:viod(0)">nav4子选项3</a></li>
                        <li><a href="script:viod(0)">nav4子选项4</a></li>
                    </ul>
                </li>
            </ul>
        </div>
        <div id="content" class="clearfix">
            <div class="content-nav col-md-3">
                <ul class="nav nav-default nav-stacked">
                    <li>
                        <router-link to="/query">查询</router-link>
                    </li>
                    <li>
                        <router-link to="/edit">修改</router-link>
                    </li>
                    <li>
                        <router-link to="/del">删除</router-link>
                    </li>
                    <li class="dropdown">
                        <a class="dropdown-toggle" data-toggle="dropdown" href="#">选项4<span class="caret"></span></a>
                        <ul class="dropdown-menu" role="menu">
                            <li><a href="script:viod(0)">选项4子选项1</a></li>
                            <li><a href="script:viod(0)">选项4子选项2</a></li>
                            <li><a href="script:viod(0)">选项4子选项3</a></li>
                            <li><a href="script:viod(0)">选项4子选项4</a></li>
                        </ul>
                    </li>
                </ul>
            </div>
            <div class="content col-md-9">
                <router-view></router-view>
            </div>
        </div>
        <div id="footer"></div>
        <template id="edittemp">
            <h1>hhhhhhhhhhhhhhhhhhhhhhhhhhhhhhh</h1>
           <!--  <div>
                <form action="">
                    <div class="input-group">
                        <span class="input-group-addon">用户ID：</span>
                        <input type="text" class="form-control" v-model="userid" name="userid" readonly="">
                    </div>
                    <div class="input-group">
                        <span class="input-group-addon">用户名：</span>
                        <input type="text" class="form-control" v-model="username" name="username" readonly=""></div>
                    <div class="input-group">
                        <span class="input-group-addon">密&nbsp;&nbsp;&nbsp;码：</span>
                        <input type="text" class="form-control" v-model="passwd" name="passwd">
                    </div>
                    <div class="input-group">
                        <span class="input-group-addon">年&nbsp;&nbsp;&nbsp;龄：</span>
                        <input type="text" class="form-control" v-model="" name="age">
                    </div>
                    <div class="input-group">
                        <span class="input-group-addon">地&nbsp;&nbsp;&nbsp;址：</span>
                        <input type="text" class="form-control" v-model="age" name="addr">
                    </div>
                    <div class="input-group">
                        <span class="input-group-addon">邮&nbsp;&nbsp;&nbsp;箱：</span>
                        <input type="text" class="form-control" v-model="email" name="email">
                    </div>
                    <div class="input-group">
                        <span class="input-group-addon">公&nbsp;&nbsp;&nbsp;司：</span>
                        <input type="text" class="form-control" v-model="company" name="company">
                    </div>
                    <div class="input-group">
                        <span class="input-group-addon">性&nbsp;&nbsp;&nbsp;别：</span>
                        <div class="gender">
                            <label class="radio-inline">
                                <input type="radio" name="gender" v-model="gender" value="1"> 男
                            </label>
                            <label class="radio-inline">
                                <input type="radio" name="gender" v-model="gender" value="0">女
                            </label>
                        </div>
                    </div></br>
                    <div class="form-group">
                        <button type="button" v-on:click="cancel" class="button btn-success col-md-3 col-md-offset-2">取消</button>
                        <button type="button" v-on:click="edit" class="button btn-success col-md-3 col-md-offset-2">修改</button>
                    </div>
                </form>
            </div> -->
        </template>
    </div>
    <script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript" src="js/bootstrap.min.js"></script>
    <script type="text/javascript" src="js/vue.min.js"></script>
    <!-- <script type="text/javascript" src="js/vue-resource.js"></script> -->
    <script type="text/javascript" src="js/vue-router.js"></script>
    <script type="text/javascript" src="js/cookie.js"></script>
    <script type="text/javascript" src="js/index.js"></script>
</body>

</html>